@import "common";

.el-container {
    height: 100%;
    width: 100%;
}
.el-main, .el-header {
    padding: 0;
}
.el-header {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    box-shadow: 0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.22)!important;
    height: 20px;
    position: absolute;
    top: 20;
    left: 0;
    z-index: 2;
    width: 100%;
}
.left {
    background: grey;
    .full();
}
.leftTop, .leftBottom{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.leftTop {
    height: 25%;
}
.leftBottom {
    height: 75%;
}
.leftTop > * {
    margin-top: 10px;
}
.leftUsername {
    font-size: 1.7em;
}
.content {
    height: calc(100% - 40px);
//    width: calc(100% - 40px);  
    padding: 20px;
    margin-top: 60px;
}
.scrollable {
    overflow-y: auto;
}
.relative {
    position: relative;
}
.component {
    position: relative;
    z-index: 1;
}

